<!DOCTYPE html SYSTEM "http://www.thymeleaf.org/dtd/xhtml1-strict-thymeleaf-spring4-4.dtd">

<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:th="http://www.thymeleaf.org" >

<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<script type="text/javascript" th:src="@{/jquery-2.1.4.min.js}"></script>
<script type="text/javascript" th:src="@{/bootstrap-3.3.7-dist/js/bootstrap.min.js}"></script>
<link type="text/css" rel="stylesheet" th:href="@{/bootstrap-3.3.7-dist/css/bootstrap.min.css}">
<script type="text/javascript" th:src="@{/bootstrap-treeview/bootstrap-treeview.min.js}"></script>
<link type="text/css" rel="stylesheet" th:href="@{/bootstrap-treeview/bootstrap-treeview.min.css}">
<script type="text/javascript" th:src="@{/bootStrap-addTabs/bootstrap.addtabs.min.js}"></script>
<link type="text/css" rel="stylesheet" th:href="@{/bootStrap-addTabs/bootstrap.addtabs.css}">
<script type="text/javascript" th:src="@{/bootstrap-table/bootstrap-table.min.js}"></script>
<script type="text/javascript" th:src="@{/bootstrap-table/locale/bootstrap-table-zh-CN.min.js}"></script>
<link type="text/css" rel="stylesheet" th:href="@{/bootstrap-table/bootstrap-table.min.css}">

<script type="text/javascript" th:src="@{/bootstrap-fileinput/js/fileinput.min.js}"></script>
<script th:src="@{/bootstrap-fileinput/js/locales/zh.js}"></script>
<style>
    .div-c{ float:left;width:29%;border:1px}
    .div-d{ float:right;width:69%;border:1px}
</style>
<body>

    <div class="div-c">
        <table id="MyTableTypeId" ></table>
    </div>
    <div class="div-d">
        <table id="MyTableId" ></table>
    </div>



</body>
<script>

    $(function (){
        queryType();
        queryJfList();
    })

    queryType = function (){
        $("#MyTableTypeId").bootstrapTable({
            url:"Sq/getTypeList",
            columns:[
                //{field: "tid", title:"编号"},
                {field: "t_lei", title:"类别",width:'100px', height:'50px'}
            ],
            onClickRow:function (value, row, index){
                let  id=value.tid


                query(id)
            }
        })
    }

    query = function(id) {
        $("#MyTableId").bootstrapTable("refresh", {
            "query": {
                typeID: id
            }
        });
    }



    queryJfList = function (id){
        $("#MyTableId").bootstrapTable({
            url:"Sq/getItemList",
            columns:[
                //{field: "xsid", title:"编号"},
                {field: "xstitle", title:"标题"},
                {field:"xsintegral",title:"积分",width:'50px', height:'50px'},
                {field:"**",title:"操作",width:'50px', height:'50px',formatter:function(value,row){
                        var str1='<button class="btn btn-success"  data-toggle="modal" data-target="#editLayer" onclick="getjfId('+row.xsid+')">申请</button>';
                        return  str1;
                }}
            ]
        })
    }

    getjfId=function (fid){
        sessionStorage.setItem("fid",fid);
        window.location.href ="sqtx.html";
    }

</script>
</html>